<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta name="description" content="{{env('SITE_DESCRIPTION')}}">
    <title>{{env('SITE_TITLE')}}</title>
    <link rel="stylesheet" type="text/css" href="{{asset('/org/site')}}/AmazeUI-2.4.2/assets/css/amazeui.css"/>
    <link href="{{asset('/org/site')}}/AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css">
    <link href="{{asset('/org/site')}}/basic/css/demo.css" rel="stylesheet" type="text/css"/>

    <link href="{{asset('/org/site')}}/css/sustyle.css" rel="stylesheet" type="text/css"/>
    {{--引入sweetalert样式--}}
    @include('admin.layouts._hdjs')
    @include('admin.layouts._message')
</head>

<body>

<!--公共的导航条和搜索框 -->
@include('site.layouts._top')
<div class="take" style="padding: 50px">
    <div class="status" style="text-align: center">
        @if($order['status'] <> '未付款')
            <h2 style="font-size:45px;font-weight: 500;color: orangered">恭喜!!!您已成功付款</h2>
            <h2 style="font-size: 30px;font-weight: 300;margin-top: 10px">页面将在2秒后跳转到首页</h2>
            <script>
                $(function () {
                    setTimeout(function () {
                        location.href = "{{route('site.index')}}";
                    }, 2000)
                })
            </script>
        @endif
        <div style="display: inline-block;">
            @if($order['status'] =='未付款')
                <img alt="模式二扫码支付"
                     src="{{asset('/org/wechat_pay/example')}}/qrcode.php?data=<?php echo urlencode($url2);?>"
                     style="width:150px;height:150px;"/>
                <h2 style="font-size:30px;font-weight: 500;color: orangered">微信支付完成后就能拥有你想要的宝贝了</h2>
            @endif
        </div>
    </div>
    @if($order['status'] == '未付款')
        <script>
            //在这个页面可以写一个js的定时器,隔2秒中就去后台查询,当前订单的状态,如果当前订单的状态变成"已付款"就刷新当前页面
            $(function () {
                setInterval(function () {
                    //通过下面的方式不行
                    {{--let status = "{{$order->where('order_num',$order['order_num'])->value('status')}}";--}}
                    //通过异步的方式隔2秒中就请求一次当前订单的状态信息,如果用户支付成功就重新加载当前页面,这个时候传递到这个页面中的参数$order是获取的最新的支付过之后的订单信息
                    $.get("{{route('site.check_order_status',['order_num'=>$order['order_num']])}}", function (res) {
                        // console.log(res);
                        if (res.valid) {
                            // 进入这个方法体说明订单已经支付成功,使用js刷新当前页面,并给用户一个支付成功的的提示
                            console.log({!! $order !!})
                            location.reload();
                        }
                    }, 'json');
                }, 2000)
            })
        </script>
    @endif

    {{--
    <form  >
        输入点儿内容:<input type="text" name="ceshi">
        <button type="button" id="ceshi">提交</button>
    </form>
    <script>
        $("#ceshi").click(function () {
            $.post("{{route('site.wxPayResult')}}",{},function (res) {
                console.log(res);
            })
        })
    </script>
    --}}
</div>

{{--页面公用的底部--}}
@include('site.layouts._bottom')
</body>
</html>
